WSTEAMA-1129 Unordered list items in the footer component should not render empty li elements, or have a role="listitem"
#12286
Conversation
| }); | ||
| return null; | ||
| }) | ||
| .filter(Boolean); |
There was a problem hiding this comment.
this line is the only code change here in this file. The rest is formatting.
|
Have we addressed the "role="listitem" for footer links" - i.e. remove role list item for all li’s if not needed part of the ticket yet? |
I can do that too. I realised I misread the comment about it on the jira ticket. Should be easy. |
|
Thanks @LilyL0u A quick check with our supported screen readers would be good please, to check we still have list semantics after the removal of the role (if you haven't already done this) |
@greenc05
|
LilyL0u
deleted the
WSTEAMA-1129-ul-list-items-should-not-render-empty
branch
Resolves JIRA [1129]
Overall changes
The issue was that in the case where we do not have the 'do not sell or share my info' link in the footer (it is on amp and not canonical when inside the UK), then the elements array containing the links to include in the links had one null value in it, and this was being rendered as an empty list item. By filtering out the null value, we no longer have this empty list item in the footer.
Code changes
Updated the elements array mapping logic to filter out null values using .filter(Boolean).
I have also removed role="listitem" as requested in the jira ticket.
Testing
Manually check the footer by inspecting the list of items in the footer and ensuring that on amp and canonical there are no empty list items. Check the layout of the page does not change too much.
The Jira ticket also suggests the following a11y checks:
as there have been some updates in screenreader software.
Helpful Links
Add Links to useful resources related to this PR if applicable.
Coding Standards
Repository use guidelines